'use strict'
const path = require('path')
const px2rem = require('postcss-px2rem')
const ESLintPlugin = require('eslint-webpack-plugin')

const postcss = px2rem({
  remUnit: 16, // 基准大小 baseSize，需要和rem.js中相同
})

function resolve(dir) {
  return path.join(__dirname, dir)
}
const name = 'shelf'
module.exports = {
  /**
   * You will need to set publicPath if you plan to deploy your site under a sub path,
   * for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
   * then publicPath should be set to "/bar/".
   * In most cases please use '/' !!!
   * Detail: https://cli.vuejs.org/config/#publicpath
   */
  publicPath: './',
  outputDir: 'dist',
  assetsDir: './static',
  lintOnSave: false,
  configureWebpack: {
    // provide the app's title in webpack's name field, so that
    // it can be accessed in index.html to inject the correct title.
    name: name,
    resolve: {
      alias: {
        '@': resolve('src'),
        '@public': resolve('public'),
        '@static': resolve('public/static'),
      },
    },
    module: {
      rules: [
        {
          test: /\.(js|vue)$/, // both .js and .vue
          enforce: 'pre',
          loader: 'eslint-loader',
          include: [resolve('src')],
          options: {
            fix: true,
          },
        },
      ],
    },
    plugins: [new ESLintPlugin()],
  },
  chainWebpack: config => {
    // 图片打包压缩，使用了 --- image-webpack-loader --- 插件对图片进行压缩
    config.plugins.delete('prefetch')
    // set svg-sprite-loader
    config.module.rule('svg').exclude.add(resolve('src/icons')).end()
    config.module
      .rule('icons')
      .test(/\.svg$/)
      .include.add(resolve('src/icons'))
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({
        symbolId: 'icon-[name]',
      })
      .end()
  },
  css: {
    loaderOptions: {
      postcss: {
        plugins: [postcss],
      },
      sass: {
        prependData: '@import "@/styles/index.scss";',
      },
    },
  },
  devServer: {
    port: 5000,
    open: true,
    before: require('./mock/mock-server.js'),

    // proxy: {
    //   '/backApi': {
    //     target: 'http://111.3.67.6:8082',
    //     ws: false,
    //     changeOrigin: true
    //   }
    // },
  },
}
